<template>
  <div>
    <dt-modal-info ref='info' :title='title' :width='800'>
      <dt-grid ref="table" :onFetch='onFetch' :height='500' :mergeCells="mergeCells"
        :highlightCurrentRow='false' :key='key' />
    </dt-modal-info>
    <relevancy-edit ref="relevancyEdit" @success='onSuccess' />
  </div>
</template>

<script>
  import Columns from './fitClassColumns'
  import planChannelApi from '@/biz/synthetic/planChannel'
  import relevancyEdit from './relevancyEdit.vue'

  export default {
    data() {
      return {
        title: '合成班打法关联配置',
        mergeCells: [],
        tableData: [],
        sortArr: [],
        key: 1
      }
    },
    components: {
      relevancyEdit
    },
    methods: {
      show(data) {
        this.key += 1
        this.$nextTick(() => {
          this.$refs.info.show()
          this.$refs.table.init(this, new Columns(this))
          this.$refs.table.fetch()
        })
      },
      onFetch(data) {
        let params = {
          buildingId: this.$dt.buildInfo().housesId,
        }
        return planChannelApi.channelList(params).then((res) => {
          if (res) {
            this.tableData = res
            this.sortArr = this.resolveArrFun(res, ['customerSourceName'])
            this.mergeFun()
            return res
          }
        })
      },
      resolveArrFun(data, keys = []) {
        //keys可以传一个数组
        var c = []
        var d = {}
        for (var element of data) {
          let element_keyStr = ''
          let element_key = []
          let element_keyObj = {}
          for (var key of keys) {
            element_key.push(element[key])
            element_keyObj[key] = element[key]
          }
          element_keyStr = element_key.join('_')
          if (!d[element_keyStr]) {
            c.push({
              ...element_keyObj,
              children: [element],
            })
            d[element_keyStr] = element
          } else {
            for (var ele of c) {
              let isTrue = keys.some((key) => {
                return ele[key] != element[key]
              })
              if (!isTrue) {
                ele.children.push(element)
              }
            }
          }
        }
        console.log(c, 'ccccccccccccccccccc');
        return c

      },
      // 合并单元格
      mergeFun() {
        this.mergeCells = []
        let spanArr = []
        this.sortArr.forEach((item) => {
          let mergeArr = new Array(item.children.length).fill(0)
          mergeArr[0] = item.children.length
          spanArr = spanArr.concat(mergeArr)
        })
        let mergeObj = {}
        spanArr.forEach((item, index) => {
          if (item > 0 && index != this.tableData.length - 1) {
            mergeObj = {
              row: index,
              col: 0,
              rowspan: item,
              colspan: 0,
            }
            this.mergeCells.push(mergeObj)
          } else if (index == this.tableData.length - 1) {
            mergeObj = {
              row: index,
              col: 0,
              rowspan: 1,
              colspan: 0,
            }
            this.mergeCells.push(mergeObj)
          }
        })
      },
      //关联渠道
      relevancyHandel(data) {
        let obj = {
          check: false,
          ...data
        }
        this.$refs.relevancyEdit.show(obj)
      },
      //关联渠道数
      relevancyNum(data) {
        console.log(data)
        if (data.channelCount == 0) return false
        let obj = {
          check: true,
          ...data,
          tableData: data.channelJson ? JSON.parse(data.channelJson) : []
        }
        this.$refs.relevancyEdit.show(obj)
      },
      onSuccess() {
        this.show()
      },
    }
  }
</script>

<style lang="scss" scoped>

</style>